var sliderWidth = 96; // 需要设置slider的宽度，用于计算中间位置

Page({
  data: {
    tabBar: {
      "selectedColor": "#3c80fe",
      "normalColor": "#333",
      "backgroundColor": "#fff",
      "selectedBackgroundColor": "#fff",
      "list": [{
        "pagePath": "pages/home/home",
        "iconPath": "/images/artboard@3x.png",
        "selectedIconPath": "/images/rectangle6@3x.png",
        "text": "订单"
      }, {
        "pagePath": "pages/me/me",
        "iconPath": "/images/artboard_2@3x.png",
        "selectedIconPath": "/images/artboard_3@3x.png",
        "text": "我"
      }]
    },
    activeIndex: 0,
    sliderOffset: 0,
    sliderLeft: 0
  },
  onLoad: function () {
    wx.setNavigationBarTitle({
      title: '订单',
    })
    wx.setNavigationBarColor({
      frontColor: '#ffffff',
      backgroundColor: '#3B80FE',
      animation: {
        duration: 400,
        timingFunc: 'easeIn'
      }
    })
    wx.getSystemInfo({
      success: res => {
        this.setData({
          sliderLeft: (res.windowWidth / this.data.tabBar.list.length - sliderWidth) / 2,
          sliderOffset: res.windowWidth / this.data.tabBar.list.length * this.data.activeIndex
        });
      }
    });
  },
  tabClick: function (e) {
    this.setData({
      sliderOffset: e.currentTarget.offsetLeft,
      activeIndex: e.currentTarget.id
    });
    if (e.currentTarget.id == 0) {
      wx.setNavigationBarTitle({
        title: '订单',
      })
      wx.setNavigationBarColor({
        frontColor: '#ffffff',
        backgroundColor: '#3B80FE',
        animation: {
          duration: 400,
          timingFunc: 'easeIn'
        }
      })
    } else {
      wx.setNavigationBarTitle({
        title: '个人中心'
      })
      wx.setNavigationBarColor({
        frontColor: '#ffffff',
        backgroundColor: '#3B80FE',
        animation: {
          duration: 400,
          timingFunc: 'easeIn'
        }
      })
    }
  }
});